<code>
<style type="text/css" title="currentStyle">
           @import "../css/ui-lightness/jquery-ui-1.7.2.custom.css";
           @import "../css/table/css/demo_table_jui.css";
           @import "../css/jquery.alerts.css";

 </style>
        <script type="text/javascript" language="javascript" src="../js/jquery-1.3.2.js"></script>
        <script type="text/javascript" language="javascript" src="../js/jquery.dataTables.js"></script>
       <script type="text/javascript" language="javascript" src="../js/jquery-ui-1.7.2.custom.min.js"></script>
       <script src="../js/jquery.alerts.js" type="text/javascript"></script>
    
                <script type="text/javascript" charset="utf-8">
                    $(document).ready(function() {
                        $("#dialog").dialog({
                            bgiframe: true,
                            autoOpen: false,
                            width:430,
                            height: 280,
                            modal: true,
                            buttons: {
                                    'Aceptar': function() {
                                        var valuesSubject=$("#modifySubjectForm").serialize();
                                        $.post("modifySubject.do", valuesSubject, function(response){
                                            if(response=="success"){
                                                jAlert("Se modifico la materia exitosamente", "Materia")
                                            }else   jAlert(response, "Error");
                                        }, "html");                                       
                                        var id_subject=$("#subjectKey").val();
                                        $("#subjectKey_"+id_subject).html($("#subjectKey").val());
                                        $("#subjectName_"+id_subject).html($("#subjectName").val());
                                        $("#subjectCredits_"+id_subject).html($("#subjectCredit").val());
                                        $("#subjectTotalHr_"+id_subject).html ($("#subjectTotalHr").val());
                                        $(this).dialog('close');
                                    },
                                    Cancel: function() {
                                            $(this).dialog('close');
                                    }
                            }                            
                        });
                    });
                </script>
                <script type="text/javascript" charset="utf-8">
                    $(document).ready(function() {
                        $("a[href=#delete]").click(function(){
                            var id=$(this).attr("id");

                          if(confirm("Estas seguro que quiere borrar esta materia?")){


                            $.post("deleteSubject.do", {id:id}, function(response){
                               // alert($(this).serialize());
                                    if(response=="success"){                                    
                                        
                                        $("#row_"+id).remove();
                                       
                                    jAlert("Se eliminado una materia exitosamente", "Materia");
                                    }else
                                        jAlert(response, "Error");
                            }, "html");
                            }
                        });

                        $("a[href=#modify]").click(function(){
                            var id_subject=$(this).attr("id");
                           // $("#idSubjectHidden").val(id_subject);
                          //  alert(id_subject);
                            $.post("getSubject.do",{id:id_subject},function(page){
                                $('#dialog').html(page);
                                $('#dialog').dialog('open');
                            }, "html");                     
                        });

                      subjectList =$('#subjectList').dataTable({
                                         "bJQueryUI": true,
                                        "sPaginationType": "full_numbers",
                                        "oLanguage": {
                                            "oPaginate": {
                                                "sFirst": "<<",
                                                "sLast": ">>",
                                                "sNext": ">",
                                                "sPrevious": "<"
                                            },
                                            "sInfo": "Registros: _TOTAL_ - Mostrando del _START_ al _END_",
                                            "sInfoEmpty": "No hay registros para mostrar",
                                            "sSearch": "Busqueda Rapida:",
                                            "sLengthMenu": "Mostrando _MENU_ registros",
                                            "sZeroRecords": "No hay registros para mostrar",
                                            "sInfoFiltered": " - Filtrando de _MAX_ registros",
                                            "sProcessing": "Servidor Ocupado, espere un momento"
                                        }
                                }); 
                    } );
                </script>
            </code>

<%@ taglib uri="http://struts.apache.org/tags-bean" prefix="bean" %>
<%@ taglib uri="http://struts.apache.org/tags-html" prefix="html" %>
<%@ taglib uri="http://struts.apache.org/tags-logic" prefix="logic" %>
<html:errors/>
<div class="demo_jui">
<logic:present name="subjectForm" property="results">
<hr width="100%" size="1" noshade="true">
<bean:size id="size" name="subjectForm" property="results" />
<logic:greaterThan name="size" value="0">

    <table cellpadding="0" cellspacing="0" border="0" class="display" id="subjectList">
        <thead>
            <tr>
                <th><bean:message key="label.subject.subjectID"/></th>
                <th><bean:message key="label.subject.name"/></th>
                <th><bean:message key="label.subject.NumCredits"/></th>
                <th><bean:message key="label.subject.totalHrs"/></th>
                <th colspan="2"><bean:message key="label.subject.operation"/></th>
            </tr>
        </thead>
        <tbody>
            <logic:iterate id="result" name="subjectForm" property="results">
                <tr id="row_${result.subjectKey}">
                    <td id="subjectKey_${result.subjectKey}"><bean:write name="result" property="subjectKey"/></td>
                    <td id="subjectName_${result.subjectKey}"><bean:write name="result" property="subjectName" /></td>
                    <td id="subjectCredits_${result.subjectKey}"><bean:write name="result" property="subjectCredits" /></td>
                    <td id="subjectTotalHr_${result.subjectKey}"><bean:write name="result" property="subjectTotalHr" /></td>
                    <td><html:link href="#modify" styleId="${result.subjectKey}" ><bean:message key="label.button.modify"/></html:link></td>
                    <td><html:link href="#delete" styleId="${result.subjectKey}"><bean:message key="label.button.delete"/></html:link></td>
                </tr>
            </logic:iterate>
        </tbody>
        <tfoot>
            <tr>
                <th><bean:message key="label.subject.subjectID"/></th>
                <th><bean:message key="label.subject.name"/></th>
                <th><bean:message key="label.subject.NumCredits"/></th>
                <th><bean:message key="label.subject.totalHrs"/></th>
                <th colspan="2"><bean:message key="label.subject.operation"/></th>
            </tr>
        </tfoot>
    </table>
           <!-- <input type="hidden" id="idSubjectHidden">-->
    <div id="dialog" title="Modificar materia">        
    </div>
</logic:greaterThan>
</logic:present>
</div>